Navigation for Kids

Edit 0 38 …

Update

The scheme below can now be implemented much more easily and in a much more standard way using tabbed browsing. I shall be reworking these notes and the Life project to show this.

The Why and How of Navigation in Wikids


Ever sat down to look something up on the internet, found an interesting link, followed it, followed further links until you lost track of what you were doing in the first place?

Children are more distractible than adults. We can't expect them not to wander and to lose track. We can't expect them to have the same attention span and focus as adults. The best we can hope for, if we wish children to gain the most from the material, is that there is some sort of continuity thread running through their explorations, and that they may pick up and resume a thread if it is made easy for them.

Wikids is organised around general topics, broken down into easily accessed sequences of pages representing sub-topics. Each topic or sub-topic sequence is presented in a single tab, paged through by clicking on 'Next' and 'Back' controls. Within each topic, there can be links to related topics via text or image links, including the 'More' link. These open in new tabs.

SubTopics.jpgFor example, the Life topic contains sub-topics on life today, life in the past and on evolution. Each of these is sub-divided into further sub-topics, and links are provided to relevant sub-topics covering geology and chemistry. Using the navigation scheme,close.jpgnext.jpgmore.jpgback.jpga child only has to press the 'Close' link, available on any tab to return to their previous context before their current one.

Maintaining the Navigation Structure


Whether you start creating a new topic for Wikids, or whether you contribute pages to existing topics, it is important to keep a record of pages within a topic, showing how they relate to one another in terms of navigation. Topic file-lists are maintained within Wikidia, using nested bullet-point lists. The text mode editor is the easiest editing mode to use for editing these lists.

Here's a shortened list of the organisation of the Life topic files as they appear in the text editor.

* [[wikids:Life]]
** [[wikids:Life Today]]
*** [[wikids:Life Today. Linnaeus]]
*** [[wikids:Life Today. Example species]]
** [[wikids:Life Yesterday]]
*** [[wikids:Life Yesterday. What are fossils]]
**** [[wikids:Life Yesterday. Geologic column. Radiometric dating]]
** [[wikids:Life Changes]]
*** [[wikids:Life Changes. Variation]]
*** [[wikids:Life Changes. Inheritance]]
**** [[wikids:Life Changes. Inheritance. Gregor Mendel]]
***** [[wikids:Life. Pollination]]
*** [[wikids:Life Changes. Mutation]]

Here's how it displays normally.

The indenting level indicates how to navigate to and from a page. The page named 'Life' has no Back or Next controls. To go from 'Life' to 'Life Today', the More control is used. From 'Life Today', the Next control links to 'Life Yestserday', and from there to 'Life Changes'. From 'Life Yesterday', the More control links to 'Life Yesterday. What are fossils'. The list is essentially the same as the diagram above, but on its side.

When creating new pages, it is important to maintain the list of the main topic the page is designed for. Be careful to update the navigation of affected pages when adding a page to a topic.
Pages, sequences or even entire topics can be linked to from another topic. Here, use conventional links to link to a point in another topic. The navigation lists and linkage are not affected. Similarly, a sub-topic may be conventionally linked to from various points within the same topic, for recap purposes, for example. There is no need to indicate this in the topic list.

Creating the Navigation Links


To provide navigation to and from a page, copy the following JavaScript.
<script language="JavaScript" type="text/JavaScript">
WikidsNav
(
"Back",
"More",
"Next"
);
</script>
Do this by highlighting all eight lines of the script and then going to 'Edit', 'Copy'.
You may find it useful to paste the script into your own text file on your computer for future use.
To place the edit controls in a Wikids page, edit the page in visual mode.
Place the cursor at the beginning of the page then click on Embed Media embed.gif in the edit toolbar.
Paste the copied JavaScript into the embed media dialog box.
Edit the "Back", "More" and "Next" entries with the appropriate page names.
Make sure all the quotation marks and commas are left in place.
If there is no page to link to, leave the entry empty with double quotes like this ""
You can enter the names of new, not-yet-created pages if you intend to create them.
Save the page and test out the navigation controls.
If there is a problem, use the visual editor mode. Click on the 'custom' box and then on Embed Media embed.gif control to edit the script.